{% load static %}

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <title>魔法书店</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
    <link rel="stylesheet" href="{% static 'css/main.css' %}">
    {% block head %}
    {% endblock %}
</head>

<body>
    <div class="container py-3">
        <header>
            <div class="d-flex flex-column flex-md-row align-items-center pb-3 mb-4 border-bottom">
                <a href="/" class="d-flex align-items-center text-dark text-decoration-none">
                    <svg xmlns="http://www.w3.org/2000/svg" width="40" height="32" class="me-2" viewBox="0 0 118 94"
                        role="img">
                        <title>Bootstrap</title>
                        <path fill-rule="evenodd" clip-rule="evenodd"
                            d="M24.509 0c-6.733 0-11.715 5.893-11.492 12.284.214 6.14-.064 14.092-2.066 20.577C8.943 39.365 5.547 43.485 0 44.014v5.972c5.547.529 8.943 4.649 10.951 11.153 2.002 6.485 2.28 14.437 2.066 20.577C12.794 88.106 17.776 94 24.51 94H93.5c6.733 0 11.714-5.893 11.491-12.284-.214-6.14.064-14.092 2.066-20.577 2.009-6.504 5.396-10.624 10.943-11.153v-5.972c-5.547-.529-8.934-4.649-10.943-11.153-2.002-6.484-2.28-14.437-2.066-20.577C105.214 5.894 100.233 0 93.5 0H24.508zM80 57.863C80 66.663 73.436 72 62.543 72H44a2 2 0 01-2-2V24a2 2 0 012-2h18.437c9.083 0 15.044 4.92 15.044 12.474 0 5.302-4.01 10.049-9.119 10.88v.277C75.317 46.394 80 51.21 80 57.863zM60.521 28.34H49.948v14.934h8.905c6.884 0 10.68-2.772 10.68-7.727 0-4.643-3.264-7.207-9.012-7.207zM49.948 49.2v16.458H60.91c7.167 0 10.964-2.876 10.964-8.281 0-5.406-3.903-8.178-11.425-8.178H49.948z"
                            fill="currentColor"></path>
                    </svg>
                    <span class="fs-4">MBook</span>
                </a>
                {% if user.is_authenticated %}
                <div class="d-flex ms-auto">
				    <a class="btn btn-secondary me-2" href="/admin/">管理</a>
                    <a class="btn btn-danger" href="/cart/">购物车</a>
                    <div class="dropdown">
                        <button class=" btn dropdown-toggle" id="dropdownUser1" data-bs-toggle="dropdown"
                            aria-expanded="false">
                            我的
                        </button>
                        <ul class="dropdown-menu text-small dropdown-menu-end" aria-labelledby="dropdownUser1">
                            <li><a class="dropdown-item" href="/user/{{user.id}}/">主页</a></li>
                            <li>
                                <hr class="dropdown-divider">
                            </li>
                            <li><a class="dropdown-item" href="/logout/">退出登录</a></li>
                        </ul>
                    </div>

                </div>
                {% else %}
                <ul class="nav ms-auto">
                    <li class="nav-item">
                        <a class="btn btn-outline-secondary me-2" aria-current="page" href="/signin/">登录</a>
                    </li>
                    <li class="nav-item">
                        <a class="btn btn-secondary" href="/signup/">注册</a>
                    </li>
                </ul>
                {% endif %}
            </div>
        </header>

        <main>
            {% block main %}
            {% endblock %}
        </main>

        <footer class="my-5 p-5 border-top">
            <div class="row">
                <div class="col-4">
                    <h3>小组成员</h3>
                    <ol>
                        <li>周千森(2015301020007)</li>
                        <li>张芷璇(2019302110196)</li>
                        <li>刘瑞霖(2019302110239)</li>
                        <li>冒泓希(2019302060197)</li>
                    </ol>
                </div>
                <div class="col-4">
                    <h3>指导老师</h3>
                    <div>吕慧</div>
                </div>
                <div class="col-4">
                    <h3>合作单位</h3>
                    <div>武汉大学计算机学院</div>
                </div>
            </div>
            <div>&copy;魔法书店(Mbook.com)</div>
        </footer>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous">
        </script>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"
        integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

    <script src="{% static 'js/main.js' %}"></script>

    {% block script %}
    {% endblock %}
</body>

</html>